<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="common_head(title,links,scripts)">
    <title>NeuMall</title>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge"/>
    <title th:replace="${title}">NeuMall</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!-- 引入公共的样式表 -->
    <style>

    </style>
    <script type="text/javascript">
        function gotoPage(page) {
            const search = location.search.split('?')[1]
            const searchComponents = search.split('&')
            searchComponents.forEach((component, index) => {
                if (component.startsWith('page=')) {
                    searchComponents.splice(index, 1)
                }
            })
            searchComponents.push('page=' + page)
            location.href = location.pathname + '?' + searchComponents.join('&')
        }

        $(() => {
            $('.neumall-nav-back-btn').click(() => {
                history.back()
            })
            // 将get url中的参数还原到action bar的input输入框中
            const search = location.search.split('?')[1]
            if (search) {
                const searchComponents = search.split('&')
                searchComponents.forEach((component, index) => {
                    if (component) {
                        const keyValue = component.split('=')
                        if (keyValue.length === 2) {
                            $('.action-bar input[name="' + keyValue[0] + '"]').val(decodeURIComponent(keyValue[1]))
                        }
                    }
                })
            }
        })
    </script>
</head>
<body>

<div class="pager-container" th:fragment="common_pager(pageInfo)">
    <div class="page-info">当前显示第 [[${pageInfo.pageNum}]] 页，共 [[${pageInfo.pages}]] 页，共为您搜索出 [[${pageInfo.total}]] 条数据</div>
    <nav class="pager-body">
        <ul class="pagination justify-content-center">
            <li class="page-item"  th:if="${pageInfo.hasPreviousPage}">
                <a class="page-link" th:href="@{'?page='+${pageInfo.prePage}}">上一页</a>
            </li>
            <li th:class="${page == pageInfo.pageNum} ? 'page-item active' : 'page-item'"
                th:each="page : ${pageInfo.navigatepageNums}" >
                <a class="page-link" th:href="@{'?page='+${page}}">[[${page}]]</a>
            </li>
            <li class="page-item" th:if="${pageInfo.hasNextPage}" >
                <a class="page-link" th:href="@{'?page='+${pageInfo.nextPage}}">下一页</a>
            </li>
        </ul>
    </nav>
</div>

</body>
</html>